CKeditor 5 out of the box does not come with upload capabilities. Uploading is supported with its plugins, some are official paid plugins that require subscriptions. There are a few free options.
Base64 upload adapter
This plugin allows uploads that will convert an uploaded image into base64 data. Very easy to use but will require you to save the complete base64 code with the post, this can be get long.
Docs
Simple image adapter
An image upload tool. It allows uploading images to an application ruing on your server using the XMLHttpRequest API with a minimal editor configuration.
Docs
Use the online builder to add the simple image adapter then download the generated bundle unzip and place the folder inside a publicly accessible place in Laravel. such as /public/js/ckeditor5
Then link ckeditor.js in the pages you want to use Ckeditor
<script src="/js/ckeditor5/build/ckeditor.js"></script>
Using Ckeditor in a textarea.
I've made a blade component called Ckeditor so I can use:
<x-form.ckeditor wire:model="content" name="content" />
To render the editor. I'm using Livewire and AlpineJS.
The component looks like this:
@props([
'name' => '',
'label' => '',
'required' => false
])
@if ($label == '')
@php
//remove underscores from name
$label = str_replace('_', ' ', $name);
//detect subsequent letters starting with a capital
$label = preg_split('/(?=[A-Z])/', $label);
//display capi
برچسب: نویسنده: استخدام کار تاريخ: دوشنبه 24 بهمن 1401 ساعت: 21:10
Tools
Livewire dev tools
AlpineJS dev tools
Livewire Kit
Livewire Demos
WireUI
Wire-elements
Raycast - Livewire docs
Packages
Laravel Livewire Wizard
Filament
Laravel AdminTW
Laravel Livewire Tables
Laravel Modules with Livewire
Livewire - a Statamic addon
Courses
Livewire courses on Codecourse.com
Livewire courses on Laracasts.com
Practical Laravel Livewire from Scratch
Advanced Laravel Livewire
Tools
Livewire dev tools
Chrome and Firefox DevTools extension for debugging Livewire applications
https://github.com/rw4lll/livewire-devtools
AlpineJS dev tools
Chrome/Firefox DevTools extension for debugging Alpine.js applications.
https://github.com/alpine-collective/alpinejs-devtools
Livewire Kit
41 Laravel Livewire Components
Ready-made. Downl
برچسب: نویسنده: استخدام کار تاريخ: دوشنبه 24 بهمن 1401 ساعت: 21:10
Let's say you have a blog and have posts ordered by their published date. Later you decide you want to pin certain posts.
Pied posts should be displayed before any other posts regardless of their published date.
The Solution
You can accomplish this by modifying the order clause in the query.
Take this order:
->orderBy('published_at', 'desc')
This will order posts by their published date in descending order.
Adding a second-order clause:
->orderBy('is_pied', 'desc')->orderBy('published_at', 'desc');
This time ordered by a is_pied column then order by the published_at column.
This will show the posts pied first and then show the posts in their published order.
The Setup
Adding a migration to add a column called is_pied to a posts table
php artisan make:migration add_pied_field_to_posts
Migration
<?php
use IlluminateSupportFacadesSchema;
use IlluminateDatabaseSchemaBlueprint;
use IlluminateDatabaseMigrationsMigration;
class AddPiedFieldToPosts extends Migration
{
/**
* Run the migrations.
*
* @retu void
*/
public function up()
{
Schema::table('posts', function (Blueprint $table) {
$table->boolean('is_pied')->default(false);
});
}
/**
* Reverse the migrations.
*
* @retu void
*/
public function down()
{
Schema::table('posts', function (Blueprint $table) {
$table->dropColumn('is_pied');
برچسب: نویسنده: استخدام کار تاريخ: دوشنبه 24 بهمن 1401 ساعت: 21:10